<div class="container mt-4" style="max-width: 800px">
  <!-- 帖子内容 -->
  <div
    id="post-detail"
    class="card p-4 mb-4 shadow-sm rounded-4 border-0"
  ></div>

  <!-- 评论区标题 -->
  <h5 class="mb-3 ms-2">评论区</h5>

  <!-- 评论列表 -->
  <div id="comment-list" class="mb-3 px-2">
    <!-- JS 动态渲染 -->
  </div>

  <!-- 评论输入框 -->
  <div class="card p-3 shadow-sm rounded-4 border-0 mx-2">
    <textarea
      class="form-control mb-2 rounded-3"
      rows="3"
      id="comment-input"
      placeholder="写下你的评论..."
    ></textarea>
    <div class="text-end mt-3">
      <button class="btn btn-primary rounded-pill px-4" id="submit-comment">
        发表评论
      </button>
    </div>
  </div>
</div>

<!-- Bootstrap Icons 引入（放最后确保生效） -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css"
/>
